<template>
  <section class="sequence">
    <div class="title">
      <el-button size="small" type="primary" :loading="loading" @click="handleSave">保存</el-button>
    </div>
    <div class="list-box">
      <el-table
        :data="tableData"
        border
        height="calc(100vh - 150px)"
        v-loading="tableLoading"
        class="table">
        <el-table-column
          type="index"
          width="60"
          align="center"
          label="序号">
        </el-table-column>
        <el-table-column
          show-overflow-tooltip
          prop="mdName"
          label="字段名称">
        </el-table-column>
        <el-table-column
          show-overflow-tooltip
          prop="mdCode"
          label="字段code">
        </el-table-column>
        <el-table-column
          prop="isEnable"
          label="是否开启">
          <template slot-scope="scope">
            <el-switch v-model="scope.row.isEnable"></el-switch>
          </template>
        </el-table-column>
        <el-table-column
          prop="ascending"
          label="升降序">
          <template slot-scope="scope">
            <el-switch
              :disabled="!scope.row.isEnable"
              v-model="scope.row.ascending"
              active-value="1"
              inactive-value="2"
              active-text="升"
              inactive-text="降">
            </el-switch>
            <!--<el-radio :disabled="!scope.row.isEnable"
                      v-model="scope.row.ascending"
                      :label="1">升
            </el-radio>
            <el-radio :disabled="!scope.row.isEnable"
                      v-model="scope.row.ascending"
                      :label="2">降
            </el-radio>-->
          </template>
        </el-table-column>
        <el-table-column
          prop="orderNo"
          width="180"
          label="顺序">
          <template slot-scope="scope">
            <avue-input-number
              v-model="scope.row.orderNo"
              size="small"
              :precision="0"
              :disabled="!scope.row.isEnable"
              controls-position
              :min-rows="1"
              :max-rows="1000"></avue-input-number>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </section>
</template>

<script>
import {
  editSequenceSet, getAllTable,
  sequenceSetList
} from '../../../../../../../api/electronicsFile/electronicsFile'

export default {
  name: 'sequenceSetAppraisal', // 序列设置
  props: {
    idTable: {
      type: String
    }
  },
  data () {
    return {
      loading: false,
      tableLoading: true,
      page: {
        pageNo: 1,
        pageSize: 1000,
        params: [{
          name: 'idTable',
          op: 'eq',
          value: this.idTable
        }]
      },
      tableData: []
    }
  },
  mounted () {
    this.getList()
  },
  methods: {
    getList () {
      this.tableLoading = true
      getAllTable(this.idTable, '2').then(ress => {
        this.tableData = []
        ress.data.data.map(item => {
          if (item.isQuickQuery) {
            this.tableData.push({
              mdCode: item.mdCode,
              mdName: item.mdName,
              isEnable: false,
              orderNo: 1,
              width: 80
            })
          }
        })
        sequenceSetList(this.page).then(res => {
          this.tableData.map(items => {
            res.data.data.list.map(item => {
              if (items.mdCode === item.mdCode) {
                items.isEnable = item.isEnable
                items.ascending = item.ascending + ''
              }
            })
          })
          this.tableLoading = false
        })
      })
    },
    handleSave () {
      this.loading = true
      this.tableData.map(item => {
        if (item.ascending) {
          item.ascending = Number(item.ascending)
        }
      })
      editSequenceSet(this.idTable, this.tableData).then(() => {
        this.$message.success('设置成功！')
        this.loading = false
        window.location.reload()
      }).catch(() => {
        this.loading = false
      })
    }
  }
}
</script>

<style lang="scss" scoped>
  .sequence {
    .title {
      text-align: right;
      padding: 10px 20px;
    }

    .list-box {
      .table {
        height: calc(100vh - 190px);
        margin-bottom: 10px;
      }

      .pages {
        padding-right: 15px;
      }
    }
  }
</style>
